<template>
  <div>
    <div style="display: block;" class="nav">
    <HomeView></HomeView>
    </div>
    <div style="display: block;margin-bottom: 20px;">
    <AboutView></AboutView>

    <div style="display: block;">
      <h1>热门推荐</h1>
    <Recommend></Recommend>

    <div style="display: block;">
      <Panels></Panels>
    </div>
    <div style="display: block;">
      <New></New>
    </div>
    </div>
    </div>
</div>
</template>

<script>

import HomeView from './HomeView.vue';
import AboutView from './AboutView.vue'
import Product from '../components/Product.vue'
import Panels from '@/components/Panels.vue';
import Recommend from '@/components/Recommend.vue';
import New from '@/views/New.vue'

export default {
  name: 'home',
    components: { 
      HomeView,
      AboutView,
      Product,
      Panels,
      Recommend,
      New
    }
}
</script>


<style>
h1 {
    text-align: center;
    font-family:"Hiragino Sans GB";
  }

</style>